body{
    background: #666;
    list-style: none;
}
ul{
    padding: 0;
    margin: 0;
}
img{
    border: 0;
}
.play{
    width: 400px;
    height: 430px;
    margin: 50px 100px;
    background: #999;
    font: 12px Arial;
}
.big_pic{
    width: 400px;
    height: 320px;
    overflow: hidden;
    border-bottom: 1px solid #ccc;
    background: #222;
    position: relative;
}
.big_pic li{
    width: 400px;
    height: 320px;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}

.mark_left{
    width: 200px;
    height: 320px;
    position: absolute;
    left: 200px;
    top: 0;
    opacity: 0.2;
    z-index: 3000;
}
.mark_right{
    width: 200px;
    height: 320px;
    position: absolute;
    left: 0;
    top: 0;
    opacity: .3; 
    z-index: 3000;
}
.big_pic .prev{
    width: 60px;
    height: 60px;
    background: url(img/left.png);
    position: absolute;
    top: 130px;
    left: 10px;
    z-index: 3001;
    cursor: pointer;/*鼠标形状：手型*/
    opacity: 0;
}
.big_pic .next{
    width: 60px;
    height: 60px;
    background: url(img/right.png);
    position: absolute;
    top: 130px;
    right: 10px;
    z-index: 3001;
    cursor: pointer;/*鼠标形状：手型*/
    opacity: 0;
}
.big_pic .text{
    position: absolute;
    left: 10px;
    top: 302px;
    z-index: 3000;
    color: #ccc;
}
.big_pic .length{
    position: absolute;
    right: 10px;
    bottom: 4px;
    z-index: 3000;
    color: #ccc;
}
.big_pic .bg{
    width: 400px;
    height: 25px;
    background: #000;
    opacity: .6;
    position: absolute;
    z-index: 2999;
    bottom: 0;
    left: 0;
}
.small_pic{
    width: 380px;
    height: 94px;
    position: relative;
    top: 7px;
    left: 10px;
    overflow: hidden;
}
.small_pic ul{
    height: 94px;
    position: absolute;
    top: 0;
    left: 0;
}
.small_pic li{
    width: 120px;
    height: 94px;
    float:  left;
    padding-right: 10px;
    cursor: pointer;
    opacity: .6;
}
.small_pic img{
    width: 120px;
    height: 94px;
}